<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title></title>
    <link href="/styles/base.css" rel="stylesheet" type="text/css">
    <link href="/styles/regist.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="/js/jquery/jquery.js"></script>
    <script type="text/javascript" src="/js/plugins/jquery-form/jquery.form.js"></script>
    <script src="/js/vue/md5.js"></script>
    <script src="/js/plugins/js-cookie/js.cookie.min.js"></script>
    <script type="text/javascript" src="/js/vue/common.js"></script>
    <script type="text/javascript" src="/js/system/regist.js"></script>



    <style type="text/css">
        body{
            font:14px/28px "微软雅黑";
        }
        .contact *:focus{outline :none;}
        .contact{
            width: 700px;
            height: auto;
            background: #f6f6f6;
            margin: 40px auto;
            padding: 10px;
        }
        .contact ul {
            width: 650px;
            margin: 0 auto;
        }
        .contact ul li{
            border-bottom: 1px solid #dfdfdf;
            list-style: none;
            padding: 12px;
        }
        .contact ul li label {
            width: 120px;
            display: inline-block;
            float: left;
        }
        .contact ul li input[type=text],.contact ul li input[type=password]{
            width: 220px;
            height: 25px;
            border :1px solid #aaa;
            padding: 3px 8px;
            border-radius: 5px;
        }
        .contact ul li input:focus{
            border-color: #c00;

        }
        .contact ul li input[type=text]{
            transition: padding .25s;
            -o-transition: padding  .25s;
            -moz-transition: padding  .25s;
            -webkit-transition: padding  .25s;
        }
        .contact ul li input[type=password]{
            transition: padding  .25s;
            -o-transition: padding  .25s;
            -moz-transition: padding  .25s;
            -webkit-transition: padding  .25s;
        }
        .contact ul li input:focus{
            padding-right: 70px;
        }
        .btn{
            position: relative;
            left: 300px;
        }
        .tips{
            color: rgba(0, 0, 0, 0.5);
            padding-left: 10px;
        }
        .tips_true,.tips_false{
            padding-left: 10px;
        }
        .tips_true{
            color: green;
        }
        .tips_false{
            color: red;
        }
    </style>
    <!--表单验证-->
    <script type="text/javascript">
        function checkna(){
            na=form1.nickname.value;
            if( na.length <1 || na.length >12)
            {
                spanname.innerHTML='<font class="tips_false">长度是1~12个字符</font>';

            }else{
                spanname.innerHTML='<font class="tips_true">输入正确</font>';

            }

        }

        //验证密码 
        function checkpsd1(){
            psd1=form1.password.value;
            var flagZM=false ;
            var flagSZ=false ;
            var flagQT=false ;
            if(psd1.length<6 || psd1.length>12){
                divpassword1.innerHTML='<font class="tips_false">长度错误</font>';
            }else
            {
                for(i=0;i < psd1.length;i++)
                {
                    if((psd1.charAt(i) >= 'A' && psd1.charAt(i)<='Z') || (psd1.charAt(i)>='a' && psd1.charAt(i)<='z'))
                    {
                        flagZM=true;
                    }
                    else if(psd1.charAt(i)>='0' && psd1.charAt(i)<='9')
                    {
                        flagSZ=true;
                    }else
                    {
                        flagQT=true;
                    }
                }
                if(!flagZM||!flagSZ||flagQT){
                    divpassword1.innerHTML='<font class="tips_false">密码必须是字母数字的组合</font>';

                }else{

                    divpassword1.innerHTML='<font class="tips_true">输入正确</font>';

                }

            }
        }
        //验证确认密码 
        function checkpsd2(){
            if(form1.password.value!=form1.rpassword.value) {
                divpassword2.innerHTML='<font class="tips_false">您两次输入的密码不一样</font>';
            } else {
                divpassword2.innerHTML='<font class="tips_true">输入正确</font>';
            }
        }

    </script>
</head>
<body>
<div class="wrapper">
    <div class="container container-login">
        <a href="javascript:;" title="返回首页" class="logo">骡窝窝</a>
        <div class="signup-forms flip">
            <div class="login-box" id="_j_login_box">
                <div class="inner inner_v2 clearfix">
                    <div class="inner_v2_left">
                        <form id="_j_login_form" action="javascript:;">
                            <div class="form-field">
                                <input id="inputPassword" type="text" placeholder="您的手机号" autocomplete="off"  value="">
                                <div class="err-tip"></div>
                            </div>
                            <div class="submit-btn">
                                <button id="_js_loginBtn">立即注册</button>
                            </div>
                        </form>
                        <div class="agreement">
                            注册视为同意<a target="_blank" href="javascript:;">《骡窝窝用户使用协议》</a>
                        </div>
                        <div class="connect">
                            <p class="hd">用合作网站账户直接登录</p>
                            <div class="bd">
                                <a href="javascript:;" class="weibo"><i></i>新浪微博</a>
                                <a href="javascript:;" class="qq"><i></i>QQ</a>
                                <a href="javascript:;" class="weixin"><i></i>微信</a>
                                <div class="clear"></div>
                            </div>
                        </div>                        </div>
                    <div class="inner_v2_right">
                        <img src="/images/qrcode.jpg">
                        <p>扫一扫<br>下载骡窝窝APP</p>
                    </div>
                </div>
            </div>
            <div class="signup-box" style="display: none;">
                <div class="add-info">
                    <div class="hd">账号注册</div>


                    <form  method="post" id="editForm" name="form1">
                        <input type="hidden" name="phone" value="" id="phone">
                        <div class="form-field m-t-10">
                            <input name="nickname" id="divname" type="text" placeholder="您的昵称" onblur="checkna()" >
                            <span class="tips" id="spanname">长度1~12个字符</span>
                            <div class="err-tip"></div>
                        </div>
                        <div class="form-field">
                            <input name="password" type="password" placeholder="您的密码" onblur="checkpsd1()">
                            <span class="tips" id="divpassword1">密码必须由字母和数字组成</span>
                            <div class="err-tip"></div>
                        </div>
                        <div class="form-field">
                            <input name="rpassword" type="password" placeholder="确认密码" onblur="checkpsd2()">
                            <span class="tips" id="divpassword2">两次密码需要相同</span>
                            <div class="err-tip"></div>
                        </div>

                        <div class="form-field">
                            <div class="clearfix">
                                <a href="#" class="vcode-send sms-code-send">获取验证码</a>
                                <input name="verifyCode" type="text" placeholder="短信验证码" autocomplete="off"class="vcode-input">
                            </div>
                            <div class="err-tip clearfix"></div>
                        </div>
                        <div class="submit-btn">
                            <button type="submit">完成注册</button>
                        </div>
                    </form>


                </div>
            </div>
        </div>
    </div>
</div>
<div class="fullscreen-bg"
     style="background-image: url('images/27.jpg');">
    <img src="images/27.jpg" style="width: auto; height: 657px; margin-top: -213px;">
</div>
</body>
</html>